<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSPON Browser</title>
<link rel="SHORTCUT ICON" href="editor/favicon.ico"> 



<style type="text/css">
.browserToolbar {
	font:13px arial,helvetica,clean,sans-serif; 
	font-size:small; 
	font-family:Arial,serif;
	height:28px;
	border: 1px solid #ccc;
	padding-top:3px;

}
a {
	text-decoration:none;
}
#tabTable td{
	border: 1px solid #bbb;
	border-bottom: 1px solid #eee;
	background-color: #eee;
}
#tabTable a{
	padding:5px;
	padding-left:15px;
	padding-right:15px;
	display:block;
	background-color: #ddd;
	text-decoration:none;
}
#tabTable a:hover{
	background-color: #fff;
}
#tabTable .selected {
	background-color: #eee;
	font-weight:bold;
}
.editButton  {
	width:25px;
	height:24px;
	cursor: pointer;
	cursor: hand;
	text-align:center;	
	padding: 1px;
	}
.editButtonHover {
	width:25px;
	height:24px;
	text-align:center;	
	background-color: #aabbdd;
	border: 1px outset #96968c;
	cursor: pointer;
	cursor: hand;
	padding: 0px;
}
.editButtonDown {
	width:25px;
	height:24px;
	text-align:center;	
	background-color: #bcf;
	border: 1px inset #96968c;
	cursor: pointer;
	cursor: hand;
	padding: 0px;
}
body {
	font-family:arial;
	font-size:0.85em;
	background-color:#FFFFFF;
	background-image:url(/images/twosupernova.jpg);
	background-repeat:no-repeat;
}
</style>

<body scroll="no">
	<h3><a href="http://www.jspon.org">JSPON</a> (Persistent JSON) Object Browser</h3>
<div id="explorer"></div>
<table>
		<tr>
			<td>
				<input type='button' onclick="applyChanges()" name='apply' value='Save' />
			</td>
			<td>
				<input type='button' onclick="revertChanges()" name='revert' value='Revert' />
			</td>
			<td>
				<input type='button' onclick="loadNewObject()" name='load' value='Load New Object' />
			</td>
		</tr>
</table>
  <script type="text/javascript" src="js/persevere.js"></script>    
  <script type="text/javascript" src="js/illuminate.js"></script>    

   <script type="text/javascript">   
function initEditButtons() {
	var divs = document.getElementsByTagName("div");
	function buttonActionCreator(className,element) {
		return function() {
			element.className =className;
		}
	}
	for (var i = 0; i < divs.length; i++) {
		var div = divs[i];
		if (div.className == "editButton") {
			var button = div.getElementsByTagName("img")[0];
			button.onmouseover = buttonActionCreator("editButtonHover",div);
			button.onmouseout = buttonActionCreator("editButton",div);
			button.onmousedown = buttonActionCreator("editButtonDown",div);
			button.onmouseup = buttonActionCreator("editButtonHover",div);
		}
	}
}
   illum.fullPage = true;
   debugMode = true;
    illum.targetPageName = "null";
    pjs.load("js/browser.js",function(component) {
    	var startingId = location.search.match(/id=[^\&]+/);
    	if (startingId)
    		startingId = decodeURIComponent(startingId[0].substring(3));
    	loadNewObject = function(startingId) { 
			if (!startingId) {
				var startTime = new Date().getTime();
	    		startingId = prompt("What JSPON id or url would you like to browse?","SampleData");
				if (!startingId && (new Date().getTime() - startTime) < 40)
					alert("You must allow scripted windows to ask for information to enter an object id");
			}
			if (startingId)			
		    	pjs.load(startingId,function(object) {
			    	var context = illum.rootContext.createChild(byId("explorer"));
			    	component.render(context,rootObject = object);
		    	});
			else	
				alert("You have not provided an object id, there is nothing to browse");
		}
		loadNewObject(startingId);
    	applyChanges = function() {
    		component.apply();
    	}
		revertChanges = function() {
			component.revert();
		}
    });
   </script>
</body>




<!--[if lte IE 7]><![if gte IE 5.5000]>
<script type="text/javascript">


function correctPNG() // correctly handle PNG transparency in Win IE 5.5 or higher.
   {
   var images = document.images;
   for(var i=0; i<images.length; i++)
      {
	  var img = images[i];
	  var imgName = img.src.toUpperCase()
	  if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
	     {
		 var imgID = (img.id) ? "id='" + img.id + "' " : ""
		 var imgClass = (img.className) ? "class='" + img.className + "' " : ""
		 var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
		 var imgStyle = "display:inline-block;" + img.style.cssText
		 if (img.onclick) {
			 var sourceCode = img.onclick.toString();
			 sourceCode = sourceCode.substring(sourceCode.indexOf("{")+2,sourceCode.lastIndexOf("}")-1);
			 var imgOnclick = img.onclick ? "onclick=\"" + sourceCode + "\" ": "";
		 }
		 else
			 var imgOnclick = "";
		 if (img.align == "left") imgStyle = "float:left;" + imgStyle
		 if (img.align == "right") imgStyle = "float:right;" + imgStyle
		 if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
		 var strNewHTML = "<img src='auth/images/spacer.gif' alt='" + img.alt + "' style='position:absolute;z-index:1;width:24px;height=24px' " + imgOnclick + "/> <span " + imgID + imgClass + imgTitle 
		 + " style=\"" + imgStyle + ";"
	     + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
		 + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
		 img.outerHTML = strNewHTML
		 i = i-1
	     }
      }
   }



</script>
<![endif]><![endif]-->


  </html>